<!doctype html>
<html lang="en">
  <head>
    <title>Title</title>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">


    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="./bootstrap/dist/css/bootstrap.min.css">

    <script src="./jquery/dist/jquery.min.js"></script>
    <script src="./popper.js/dist/umd/popper.min.js"></script>
    <script src="./bootstrap/dist/js/bootstrap.min.js"></script>


    <script src="./vue/dist/vue.min.js"></script>
    <script src="./moment/moment.js"></script>
    <script src="./moment/locale/zh-cn.js"></script>



    <link rel="stylesheet" href="./summernote/dist/summernote-bs4.css">

    <script src="./summernote/dist/summernote-bs4.js"></script>
    <script src="./summernote/dist/lang/summernote-zh-CN.min.js"></script>


  </head>
  <body>
      

    <div class="container" id="foDetailApp">
      <div class="jumbotron">
        <h1 class="display-3">{{amtf.title}} </h1>
        <p class="lead">　 


        <div id="summernote">{{amtf.note}}</div>
        <hr class="my-2">

    </div>
    </div>
    
  </body>
</html>

<script>


   new Vue({
      el: '#foDetailApp',
       data: {

         amtf: {},
       },
       methods: {

           getQueryString(name) {
               var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
               var r = window.location.search.substr(1).match(reg);
               if (r != null) return unescape(r[2]);
               return null;
           },


           queryDetail(){

               var id = this.getQueryString("id");

          var _self = this;
                $.ajax({
                    // crossDomain: true,
                    type: "get",
                    url: `../amtfs/${id}`,
                    // data: "data",
                    dataType: "json",
                    success: function (response) {
                        // console.log(response);
                        if (response.code == 0) {

                            console.log(response);
                            _self.amtf = response.dat;

                            $('#summernote').summernote('code', _self.amtf.note);
                        }

                    }
                });
         }
       },
       mounted() {

           $('#summernote').summernote({
               // height: 300,                 // set editor height
               airMode: true,
               lang: 'zh-CN',
               // placeholder: placeholder,
               minHeight: 300,
               dialogsFade: true, // Add fade effect on dialogs
               dialogsInBody: true, // Dialogs can be placed in body, not in
               // summernote.
               // disableDragAndDrop: false,// default false You can disable drag
               // and drop

           });
          this.queryDetail();
           $('#summernote').summernote('disable');

       },



   });


</script>